import React from 'react';
import { ConfigProvider } from 'antd';
import { PageLoading } from '@ant-design/pro-layout';
import type { ConnectProps } from 'umi';
import { Redirect, connect } from 'umi';
import { WaterMark } from '@ant-design/pro-components';
import type { ConnectState } from '@/models/connect';
import type { CurrentUser } from '@/models/user';
import zhCN from 'antd/es/locale/zh_CN';

type SecurityLayoutProps = {
  loading?: boolean;
  currentUser?: CurrentUser;
} & ConnectProps;

type SecurityLayoutState = {
  isReady: boolean;
};

const findPathOne = (menuList: any[], perm: string) => {
  let item: any = null;
  for (let index = 0; index < menuList.length; index++) {
    const element = menuList[index];
    if (item && item.path) {
      break;
    }
    if (element && element.perm && element.perm.indexOf(perm) > -1) {
      item = element;
      break;
    }
    item = element && element.children ? findPathOne(element.children, perm) : null;
  }
  if (item && item.children && item.children.length > 0) {
    return item.children[0];
  }
  return item || {};
};

class SecurityLayout extends React.Component<SecurityLayoutProps, SecurityLayoutState> {
  state: SecurityLayoutState = {
    isReady: false,
  };

  componentDidMount() {
    this.setState({
      isReady: true,
    });
    const { dispatch } = this.props;
    if (dispatch) {
      dispatch({
        type: 'user/fetchCurrent',
        payload: {
          type: 'ls',
        },
      });
    }
    
  }

  render() {
    const { isReady } = this.state;
    const { children, loading, currentUser, route } = this.props;
    // You can replace it to your authentication rule (such as check token exists)
    // You can replace it with your own login authentication rules (such as judging whether the token exists)
    const isLogin = currentUser && currentUser.userId;
    // const queryString = stringify({
    //   redirect: window.location.href,
    // });
    if ((!isLogin && loading) || !isReady) {
      return <PageLoading />;
    }
    if (!isLogin && window.location.hash.indexOf('/user/login') > -1) {
      return <Redirect to={'/user/login'} />;
    }
    //需要判断登录跳转的页面当前人有没有权限，没有权限自动跳转到权限中的第一个对应的页面
    const perm = (currentUser && currentUser.perms) || [];
    if (
      perm.length > 0 &&
      perm.indexOf('OA_PROJECT_MANAGER_QUERY') == -1 &&
      window.location.hash.indexOf('/laborSupervision/projectRecord') == 1
    ) {
      for (let index = 0; index < perm.length; index++) {
        const element = perm[index];
        const item = findPathOne(route.routes || [], element);
        if (item && item.path) {
          return <Redirect to={item.path} />;
        }
      }
    }
    return (
      <WaterMark content={currentUser?.name} gapX={90} gapY={100}>
        <ConfigProvider locale={zhCN}>{children}</ConfigProvider>
      </WaterMark>
    );
  }
}

export default connect(({ user, loading }: ConnectState) => ({
  currentUser: user.currentUser,
  loading: loading.models.user,
}))(SecurityLayout);
